<template>
  <div class="ele-body">
    <div class="bg-fff">
      <a-form
        :label-col="{ md: { span: 2 }, sm: { span: 4 }, xs: { span: 24 } }"
        :wrapper-col="{ md: { span: 22 }, sm: { span: 20 }, xs: { span: 24 } }"
      >
        <a-row :gutter="24">
          <a-col :md="24" :sm="24" :xs="24">
            <div>
              <div class="padding-15">
                <div class="flex align-center justify-between margin-bottom-15">
                  <span class="fs-14">查看退货单</span>
                </div>
                <table cellpadding="0" cellspacing="0" class="recepit_table2">
                  <tbody>
                    <tr>
                      <td class="tit">退货单号</td>
                      <td>{{ info.refund_sn || '' }}</td>
                      <td class="tit">创建时间</td>
                      <td>{{ info.create_time || '' }}</td>
                      <td class="tit">来源</td>
                      <td>{{ info.store_name || '' }}</td>
                    </tr>
                    <tr>
                      <td class="tit">原售价</td>
                      <td>{{ info.real_amount || '' }}</td>
                      <td class="tit">数量</td>
                      <td>{{ info.num || '' }}</td>
                      <td class="tit">收款金额</td>
                      <td>{{ info.pay_amount || '' }}</td>
                    </tr>
                    <tr>
                      <td class="tit">应退金额</td>
                      <td>{{ info.amount || '' }}</td>
                      <td class="tit">折旧金额</td>
                      <td>{{ info.dep_charge || '' }} </td>
                      <td class="tit">实退金额</td>
                      <td>{{ info.refund_amount || '' }}</td>
                    </tr>
                    <tr>
                      <td class="tit">退款方式</td>
                      <td>{{ info.refund_pay_name || '' }}</td>
                      <td class="tit">扣减积分</td>
                      <td>{{ info.points || '' }} </td>
                      <td class="tit">扣减礼金</td>
                      <td>{{ info.cash || '' }}</td>
                    </tr>
                    <tr>
                      <td class="tit">原销售单</td>
                      <td>{{ info.order_sn || '' }}</td>
                      <td class="tit">销售时间</td>
                      <td>{{ info.sales_time || '' }} </td>
                      <td class="tit">收银员</td>
                      <td>{{ info.make_user_name || '' }}</td>
                    </tr>
                    <tr>
                      <td class="tit">支付方式</td>
                      <td></td>
                      <td class="tit">消费动机</td>
                      <td>{{ info.motive_name || '' }} </td>
                      <td class="tit">客户来源</td>
                      <td>{{ info.from_name || '' }}</td>
                    </tr>
                    <tr>
                      <td class="tit">主销导购</td>
                      <td>{{ info.main_salesman_name || '' }}</td>
                      <td class="tit">辅销导购</td>
                      <td>{{ info.make_user_name || '' }} </td>
                      <td class="tit">销售班组</td>
                      <td>{{ info.salesman_team_name || '' }}</td>
                    </tr>
                    <tr>
                      <td class="tit">会员昵称</td>
                      <td>{{ info.nickname || '' }}</td>
                      <td class="tit">会员手机</td>
                      <td>{{ info.mobile || '' }} </td>
                      <td class="tit">备注</td>
                      <td>{{ info.note || '' }}</td>
                    </tr>
                  </tbody>
                </table>
              </div>
              <div class="padding-15">
                <div class="flex align-center justify-between margin-bottom-15">
                  <span class="fs-14">货品详情</span>
                </div>
                <div class="kd-solid margin-top-15">
                  <div class="flex">
                    <!-- 左侧-->
                    <div class="flex1">
                      <div class="flex align-center">
                        <div class="kd_left">图片</div>
                        <div class="kd_right flex align-center">
                          <a-image
                            :width="30"
                            :height="30"
                            :src="info2.thumb_url"
                          />
                        </div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">条码</div>
                        <div class="kd_right">{{ info2.bar_code || '' }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">小类</div>
                        <div class="kd_right">{{
                          info2.subclass_code_name || ''
                        }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">品类</div>
                        <div class="kd_right">{{
                          info2.classes_code_name || ''
                        }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">成色</div>
                        <div class="kd_right">{{
                          info2.quality_code_name || ''
                        }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">货品名称</div>
                        <div class="kd_right">{{ info2.name || '' }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">数量</div>
                        <div class="kd_right">{{ info2.num || '' }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">货重</div>
                        <div class="kd_right">{{
                          info2.piece_weight || ''
                        }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">净金重</div>
                        <div class="kd_right">{{
                          info2.gold_weight || ''
                        }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">销售金价</div>
                        <div class="kd_right"
                          >{{ info2.sales_gold_price || '' }}元/g</div
                        >
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">销售工费</div>
                        <div class="kd_right">{{
                          info2.sales_labor || ''
                        }}</div>
                        <span class="kd_right_text"
                          >元/
                          <template v-if="info2?.detail?.labor_type == 1"
                            >g</template
                          >
                          <template v-if="info2?.detail?.labor_type == 2"
                            >件</template
                          >
                        </span>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">销售标记</div>
                        <div class="kd_right">{{ info2.sales || '' }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">赠送积分</div>
                        <div class="kd_right">{{ info.points || '' }}</div>
                      </div>
                    </div>
                    <!-- 右侧 -->
                    <div class="flex1">
                      <div class="flex align-center">
                        <div class="kd_left">标签价</div>
                        <div class="kd_right flex1">{{
                          info2.sticker_price || ''
                        }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">原售价</div>
                        <div class="kd_right flex1">{{
                          info2.original_amount || ''
                        }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">实售价</div>
                        <div class="kd_right flex1">{{
                          info2.real_amount || ''
                        }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">固定折扣</div>
                        <div class="kd_right">{{
                          info2.regular_discount || ''
                        }}</div>
                        <span class="kd_right_text">%</span>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">卡券编号</div>
                        <div class="kd_right flex1">{{
                          info2.coupon_id || ''
                        }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">卡券详情</div>
                        <div class="kd_right flex1">{{
                          info2.coupon_id || ''
                        }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">积分抵扣</div>
                        <div class="kd_right">{{
                          info2.points_deduction || ''
                        }}</div>
                        <span class="kd_right_text">元</span>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">抹零</div>
                        <div class="kd_right">{{
                          info2.small_change || ''
                        }}</div>
                        <span class="kd_right_text">元</span>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">实售折扣</div>
                        <div class="kd_right flex1"
                          >{{ info2.real_discount || 0 }}%</div
                        >
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">积分扣减</div>
                        <div class="kd_right flex1"
                          >{{ info2.points || 0 }}%</div
                        >
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">单件备注</div>
                        <div class="kd_right flex1">{{ info2.note || '' }}</div>
                      </div>
                      <div class="flex align-center">
                        <div class="kd_left">赠送礼金</div>
                        <div class="kd_right flex1">{{ info2.cash || '' }}</div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </a-col>
        </a-row>
      </a-form>
    </div>
  </div>
</template>

<script setup>
  import { ref, reactive, unref, onMounted } from 'vue';
  import { useRouter } from 'vue-router';
  import { message, Modal } from 'ant-design-vue';
  import { finishPageTab, reloadPageTab } from '@/utils/page-tab-util';
  import { get_refund_manage_detail } from '@/api/order/order/refund_manage';
  const { currentRoute, push } = useRouter();
  const { query } = unref(currentRoute);
  const loading = ref(false);
  const info = ref({});
  const info2 = ref({});

  onMounted(() => {
    console.log(query);
    if (query.refund_sn) {
      get_refund_manage_detail({ refund_sn: query.refund_sn }).then((res) => {
        info.value = res;
        info2.value = res.item;
      });
    }
  });
</script>

<style lang="less" scoped></style>
